<%@ page contentType="text/html;charset=UTF-8"%>
<html>
<head>
<title>Tareas por hacer</title>
<meta name="layout" content="barraUsuario">
</head>
<body>

	<g:render template="/common/barraLateralBacklog" />
	<g:render template="/common/barraBacklogToDo" />
	
	<div id="pagBacklog">
	
		<div id="panelOculto">
		${contadorTareas = 0}
		<g:each in="${taskInstanceList}" status="i" var="taskInstance">
			<g:each in="${backlogInstance.tasks}"  var="t">
				<g:if test="${taskInstance.state == 0 && t == taskInstance}">
					${contadorTareas++}					
				</g:if>
			</g:each>
		</g:each>
		</div>
					
		<g:form action="toDoing" method="post">
			
			<div id="pagToDoDoingDone">
				<table>
					<thead>
						<tr>
							<g:if test="${contadorTareas != 0}">
							<td></td>
							<g:sortableColumn property="name" title="Name" />
							<g:sortableColumn property="category" title="Category" />
							<g:sortableColumn property="description" title="Description" />
							<g:sortableColumn property="finishDate" title="Finish Date" />
							<g:sortableColumn property="startedDate" title="Started Date" />
							</g:if>
						</tr>
					</thead>
					<tbody>
						<g:each in="${taskInstanceList}" status="i" var="taskInstance">
							<g:each in="${backlogInstance.tasks}"  var="t">
							<g:if test="${taskInstance.state == 0 && t == taskInstance}">
							<tr class="${(i % 2) == 0 ? 'even' : 'od'}">
								<td><g:checkBox name="${taskInstance.name}" value="${false}"/></td>
								<td id="tamNombre"><g:link controller="task" action="show" id="${taskInstance.id}" title="Ver detalles">${fieldValue(bean: taskInstance, field: "name")}</g:link></td>
								<td>
									<div id="cartaOculta"><img id="imgTransparente"/>
										<div class="cartaOculta">
											<g:each in="${cartInstanceList}" var="cartInstance">
											<g:if test="${cartInstance.categoria == taskInstance.category}">
											<div id="${(cartInstance.tipo == 1||cartInstance.tipo == 2)? 'cartaVerdeMini' : ((cartInstance.tipo == 3||cartInstance.tipo == 4)? 'cartaAmarillaMini' : 'cartaAzulMini')}">
												<div id="${(cartInstance.tipo == 1||cartInstance.tipo == 2)? 'tituloCartaVerdeMini' : ((cartInstance.tipo == 3||cartInstance.tipo == 4)? 'tituloCartaAmarillaMini' : 'tituloCartaAzulMini')}">
													${cartInstance.nombre}
												</div>
												<div id="${(cartInstance.tipo == 1||cartInstance.tipo == 2)? 'encabezadoCartaVerdeMini' : ((cartInstance.tipo == 3||cartInstance.tipo == 4)? 'encabezadoCartaAmarillaMini' : 'encabezadoCartaAzulMini')}">
													${cartInstance.encabezado}
												</div>
												<div>
													<img id="garabato"/>
												</div>
												<div id="${(cartInstance.tipo == 1||cartInstance.tipo == 2)? 'pieCartaVerdeMiniO' : ((cartInstance.tipo == 3||cartInstance.tipo == 4)? 'pieCartaAmarillaMiniO' : 'pieCartaAzulMiniO')}">
													${cartInstance.numero}
												</div>
											</div>
											</g:if>
											</g:each>
										</div>
									</div>
								${fieldValue(bean: taskInstance, field: "category")}</td>
								<td id="tamDescripcion">${fieldValue(bean: taskInstance, field: "description")}</td>
								<td><g:formatDate date="${taskInstance.finishDate}" /></td>
								<td><g:formatDate date="${taskInstance.startedDate}" /></td>
							</tr>
							</g:if>
							</g:each>
						</g:each>
					</tbody>
				</table>
			</div>			
			<g:submitButton id="botonRealizando" name="toDoing" value="Realizando" />
			<g:link controller="task" action="create" id="${backlogInstance.id}"><img id="agregarTareaIcono" title="Agregar una nueva tarea" /></g:link>
		</g:form>	
	</div>
	
</body>
</html>